<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>一席地</title>
		<meta name="Keywords" content="一席地，鸡">
		<meta name="Description" content="一席地什么什么介绍">
		<meta content="target-densitydpi=device-dpi, width=640" name="viewport">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="white">
		<meta name="format-detection" content="telephone=no">
		<link rel="stylesheet" href="css/common.css">
		<script type="text/javascript" src="js/jquery.js"></script>
		<script>
			/*不同分辨率手机加载*/
				var userScalable = "no";
				var ins = "";
				(function() {
					if (window.devicePixelRatio === 1.5) {
						userScalable = "yes";
						ins = "initial-scale=0.5"
					}
					var text = "<meta content='" + ins + ", target-densitydpi=device-dpi, width=640,user-scalable=" + userScalable + "' name='viewport'>";
					document.write(text);
				})();
		</script>

	</head>

<body class="bgT-f4">
	<article class="w640">
		<header class="h90">
			<div class="fix-header">
				<div class="order_box">
					<h1 class="logo_h1"></h1>
					<div class="center">鲜活送商品列表</div>
					<a class="logo_product" href="javascript:;"></a>
				</div>
				<section id="produce_menu" class="hide">
					<h3 class="produce_list_h3 bgT-ee pore">招牌菜</h3>
					<h3 class="produce_list_h3 bgT-ee pore">配菜</h3>
					<h3 class="produce_list_h3 bgT-ee pore">调理</h3>
				</section>
			</div>
		</header>

		<section>

			<div id="produce_list" class="marB80">

				<h3 class="produce_list_h3 bgT-fb pore ruleBoxShow"><span class="rulebtn"></span>招牌菜</h3>
				<div>
					<ul>
						<li class="clearfix produce_nav borB1">
							<div class="fl">
								<a href="">
									<img class="produce_list_img" alt="图介绍" width="164" height="124" src="img/add_img04.png">
								</a>
							</div>
							<h3 class="marB8 paddT15"><a class="col003 fontS28 " href="javascript:;">本地鸡窝</a></h3>
							<p class="colff9 fontS28 marB10">￥60</p>
							<p class="cola8a produce_icon">99人点过</p>
							<div class="submi_btn">
								<a class="submi_red" href=""></a>
								<span><input type="" name="" id="" value="1" /></span>
								<a class="submi_add" href=""></a>
							</div>
						</li>

						<li class="clearfix produce_nav borB1">
							<div class="fl">
								<a href="">
									<img class="produce_list_img" alt="图介绍" width="164" height="124" src="img/add_img04.png">
								</a>
							</div>
							<h3 class="marB8 paddT15"><a class="col003 fontS28 " href="javascript:;">本地鸡窝</a></h3>
							<p class="colff9 fontS28 marB10">￥60</p>
							<p class="cola8a produce_icon">99人点过</p>
							<div class="submi_btn">
								<a class="submi_red" href=""></a>
								<span><input type="" name="" id="" value="1" /></span>
								<a class="submi_add" href=""></a>
							</div>
						</li>

					</ul>
				</div>
				<h3 class="produce_list_h3 bgT-fb pore ruleBoxShow"><span class="rulebtn"></span>配菜</h3>
				<div>
					<ul>
						<li class="clearfix produce_nav borB1">
							<div class="fl">
								<a href="">
									<img class="produce_list_img" alt="图介绍" width="164" height="124" src="img/add_img04.png">
								</a>
							</div>
							<h3 class="marB8 paddT15"><a class="col003 fontS28 " href="javascript:;">本地鸡窝</a></h3>
							<p class="colff9 fontS28 marB10">￥60</p>
							<p class="cola8a produce_icon">99人点过</p>
							<div class="submi_btn">
								<a class="submi_red" href=""></a>
								<span><input type="" name="" id="" value="1" /></span>
								<a class="submi_add" href=""></a>
							</div>
						</li>

						<li class="clearfix produce_nav borB1">
							<div class="fl">
								<a href="">
									<img class="produce_list_img" alt="图介绍" width="164" height="124" src="img/add_img04.png">
								</a>
							</div>
							<h3 class="marB8 paddT15"><a class="col003 fontS28 " href="javascript:;">本地鸡窝</a></h3>
							<p class="colff9 fontS28 marB10">￥60</p>
							<p class="cola8a produce_icon">99人点过</p>
							<div class="submi_btn">
								<a class="submi_red" href=""></a>
								<span><input type="" name="" id="" value="1" /></span>
								<a class="submi_add" href=""></a>
							</div>
						</li>

					</ul>
				</div>
				<h3 class="produce_list_h3 bgT-fb pore ruleBoxShow"><span class="rulebtn"></span>调理</h3>
				<div>
					<ul>
						<li class="clearfix produce_nav borB1">
							<div class="fl">
								<a href="">
									<img class="produce_list_img" alt="图介绍" width="164" height="124" src="img/add_img04.png">
								</a>
							</div>
							<h3 class="marB8 paddT15"><a class="col003 fontS28 " href="javascript:;">本地鸡窝</a></h3>
							<p class="colff9 fontS28 marB10">￥60</p>
							<p class="cola8a produce_icon">99人点过</p>
							<div class="submi_btn">
								<a class="submi_red" href=""></a>
								<span><input type="" name="" id="" value="1" /></span>
								<a class="submi_add" href=""></a>
							</div>
						</li>

						<li class="clearfix produce_nav borB1">
							<div class="fl">
								<a href="">
									<img class="produce_list_img" alt="图介绍" width="164" height="124" src="img/add_img04.png">
								</a>
							</div>
							<h3 class="marB8 paddT15"><a class="col003 fontS28 " href="javascript:;">本地鸡窝</a></h3>
							<p class="colff9 fontS28 marB10">￥60</p>
							<p class="cola8a produce_icon">99人点过</p>
							<div class="submi_btn">
								<a class="submi_red" href=""></a>
								<span><input type="" name="" id="" value="1" /></span>
								<a class="submi_add" href=""></a>
							</div>
						</li>

					</ul>
				</div>

			</div>

		</section>
		
		<aside>
			
				<div class="produce_box">
					<ul>
					<li class="clearfix pore"><a class="produce_box_a" href=""></a><span class="fl col666 w260">本地鸡窝</span><span class="fl colfd2 w110">60元</span>
					<div class="submi_btn">
							<a class="submi_red" href=""></a>
							<span><input type="" name="" id="" value="1" /></span>
							<a class="submi_add" href=""></a>
					</div>
					</li>
					<li class="clearfix pore"><a class="produce_box_a" href=""></a><span class="fl col666 w260">本地鸡窝</span><span class="fl colfd2 w110">60元</span>
					<div class="submi_btn">
							<a class="submi_red" href=""></a>
							<span><input type="" name="" id="" value="1" /></span>
							<a class="submi_add" href=""></a>
					</div>
					</li>
					<li class="clearfix pore"><a class="produce_box_a" href=""></a><span class="fl col666 w260">本地鸡窝</span><span class="fl colfd2 w110">60元</span>
					<div class="submi_btn">
							<a class="submi_red" href=""></a>
							<span><input type="" name="" id="" value="1" /></span>
							<a class="submi_add" href=""></a>
					</div>
					</li>
					
					<li class="clearfix pore"><a class="produce_box_a" href=""></a><span class="fl col666 w260">本地鸡窝</span><span class="fl colfd2 w110">60元</span>
					<div class="submi_btn">
							<a class="submi_red" href=""></a>
							<span><input type="" name="" id="" value="1" /></span>
							<a class="submi_add" href=""></a>
					</div>
					</li>
					<li class="clearfix pore"><a class="produce_box_a" href=""></a><span class="fl col666 w260">本地鸡窝</span><span class="fl colfd2 w110">60元</span>
					<div class="submi_btn">
							<a class="submi_red" href=""></a>
							<span><input type="" name="" id="" value="1" /></span>
							<a class="submi_add" href=""></a>
					</div>
					</li>
					
					
					</ul>
				</div>
				
			
			<div class="produce_fixbo">
		
				<div class="produce_fixnum"><span>5</span>
				</div>
				<div class="produce_fixpri">￥60</div>
				<a class="produce_fixbtn" href="">选好了</a>
			</div>
		</aside>
		
		<section>
		
			<div id="dialogBg"></div>
			<div class="animated" id="dialog">
				<h2 class="dialog_title"><span class="fr" id="cleardialog"></span>本地鸡窝</h2>
				<div>
					<img src="img/add_img05.png" />
				</div>
				<div class="padd1030 borB1 col666">本地及口味纯正，无污染，肉鲜美，适合老人和孕妇食用。</div>
				<div class="cola8a padd2030">
					<span><em class="colff9 fontS32">60元</em>/份</span>
					<div class="produce_btn_dig">
						<a href="" class="submi_red"></a>
						<span><input type="" name="" id="" value="1" /></span>
						<a href="" class="submi_add"></a>
					</div>
				</div>
			</div>
		
		</section>
			
	</article>
	<script>
		$(function() {
		//这里是菜单展开效果
		(function(){
			
			$(document).on("click", ".order_box > a:last", function() {
				var $parent = $(this).parent().next();
				if ($parent.is(":visible")) {
					$parent.stop().slideUp();
					$(this).attr("class", "logo_product");
				} else {
					$parent.stop().slideDown();
					$(this).attr("class", "logo_product1");
				}
			}).on("click", "#produce_list > h3", function() {
				if ($(this).next().is(":visible")) {
					$(this).removeClass("ruleBoxShow");
					$(this).next().slideUp();
				} else {
					$(this).addClass("ruleBoxShow");
					$(this).next().slideDown();
				}
			}).on("click","#produce_menu h3",function(){
				$(this).parent().stop().slideUp();
				$(".order_box > a:last").attr("class", "logo_product");
				var that = $(this).index();
				$('html, body').animate({ 
				scrollTop:parseInt($("#produce_list > h3").eq(that).offset().top)-90
				}, 300); 
				if($("#produce_list > h3").eq(that).next().is(":hidden")){
					$("#produce_list > h3").eq(that).addClass("ruleBoxShow");
					$("#produce_list > h3").eq(that).next().slideDown();
					
				}
				
			});
		})();
		
		//这里是弹框的代码
		(function(){
			var $width,$height,$className;
			var getcw=function(){
				$width=$(window).width();
				$height=$(window).height();
				$("#dialogbg").width($width).height($height);
			}
			getcw();
			$(window).resize(function(){
				getcw();
			});
			$(document).on("click",".produce_nav h3 a",function(){
				$("#dialogBg").fadeIn();
				$('#dialog').removeAttr("class").addClass("animated bounceInDown").fadeIn();
			}).on("click","#cleardialog",function(){
				$('#dialogBg').fadeOut(1000);
				$('#dialog').addClass('bounceOutUp').fadeOut();
			});
		})();
		
		
		
		//这里是点击购物数量展开
		(function(){
			$(document).on("click",".produce_fixnum",function(){
				var $por_box=$(".produce_box");
				var por_H=$por_box.height();
				if(por_H>340){
					$por_box.css({"overflow-y":"scroll","height":"340"});
				}else{
					$por_box.css({"overflow-y":"hidden","height":"auto"});
				};
				if($por_box.is(":visible")){
					$por_box.animate({"bottom":-por_H},300,function(){
						$(this).hide()
					});
				}else{
					$por_box.show().animate({"bottom":72},300);
				}
				
			});
			

			
		})();
		
		
		});
	</script>
</body>

</html>